<template>
    <div>
      <div>
        <div>
          <Input type="text" @on-click="init()" placeholder="请输入编码" style="width: 164px;margin-right: 15px" v-model="params.id"
                 icon="ios-search"/>
          <Input type="text" @on-click="init()" placeholder="请输入关键字" style="width: 164px" v-model="params.title"
                 icon="ios-search"/>
          <Button type="primary" @click="init()" style="margin-left: 20px">搜索</Button>
        </div>
      </div>
      <div style="margin: 20px 0px">
        <template>
          <Table :columns="columns1" :data="data1">
            <template slot-scope="{ row, index }" slot="file_url">
              <div v-if="row.file_url!==undefined">
                <Button type="primary" size="small" style="margin-right: 5px" @click="show(index,row)">查看</Button>
              </div>
              <div v-else>
                <Button type="primary" size="small" style="margin-right: 5px" disabled>暂无</Button>
              </div>
            </template>
          </Table>
        </template>
      </div>
      <Modal
        v-model="modal"
        :title="tittle"
        width="1100">
        <embed v-if="modal" :src="img" width="100%" height="600"/>
      </Modal>
    </div>
</template>

<script>
import { eventlist } from '@/api/eventlist'

export default {
  name: 'index',
  data () {
    return {
      columns1: [
        {
          title: '编码',
          key: 'id'
        },
        {
          title: '关键字',
          key: 'text'
        },
        {
          title: 'PDF',
          slot: 'file_url'
        }
      ],
      data1: [],
      modal: false,
      tittle: '',
      img: '',
      params: {
        id: '',
        title: ''
      }
    }
  },
  methods: {
    show (e1, e2) {
      this.img = ''
      this.tittle = e2.text
      this.img = e2.file_url
      console.log(this.img)
      this.modal = true
    },
    init () {
      let data = this.params
      eventlist(data).then(ret => {
        if (ret.data.errcode === 0) {
          this.data1 = ret.data.data
        }
      })
    }
  },
  mounted () {
    this.init()
  }
}
</script>

<style scoped>

</style>
